10 Things We Did To Speed Up The Load Time Of Our Website
As you know one thing that happened when Google did their Panda Penguin update is they looked at the usability factor of peoples website. In other words how engaging is your site, and with that metric, how fast does it deliver that content. A slow website is a bad website because users may click off before it loads. Ours was slow. To much crap going on everywhere and to many things loading. So I decided to see if I can improve the load time.
First of All I Ran the Initial Speed Tests to see How Slow I am
I ran the tests on the following sites, and they all came back with about 85% of all websites load faster than mine. Now I don’t know if I agree with that because I cant believe that 85% of the worlds website owners have focused their attention in making even some upgrades to speeding up their site but apparently you guys are doing it. Google said my PageSpeed Insights scores were 38/100 mobile and 42/100 for desktop. So it looks like I have a lot of work to do.
Here are the tools I used to measure the speed of my site:
GTMetrix can help you develop a faster, more efficient, and all-around improved website experience for your users. It is easy to check your site on this testing program and you can setup a free account to measure your site. Right now on GMetrix I have a page speed grade of A (93%) and YSlow Grade of B (85%).
Pingdom built this Website Speed Test to help you analyze the load speed of your websites and learn how to make them faster. It lets you identify what about a web page is fast, slow, too big, what best practices you’re not following, and so on. They have tried to make it useful both to experts and novices alike. My performance grade is 96/100 with 92 requests, 2.71s load time and 2.0mb page size. I was faster than 58% of all websites.
Googles PageSpeed insights is probably the benchmark you want to test on. This site is very hard to understand which I think is normal for Google but with a little research and help you can manage to speed up your site with their recommendations. Currently my user experience is 63/100 for mobile and 74/100 for desktop. In addition you should check your site on Googles mobile friendly site tester.
So here are the 10 things I did to help speed up my site:
- I love this one, it was so simple. All I did was replace some code in my header.php file that was loading PHP code and translating it into HTML. I simply replaced the code with the HTML code and voila!, it loaded much faster. To do this you simply need to read this article because the fix was so easy and so cool they should get as many eyeballs to the article as possible.
- I had to make a decision and this revolved around the mobile accessibility of the site. It is way to slow and it has to do with my theme not being responsive enough. So I either need to install a plugin like WPtouch, JetPack or other mobile detector or switch to a responsive theme. More to come on this decision. To check your site for
mobile friendliness look to Googles mobile page checker for a simple answer. - I looked at my web hosting site to see if I was optimized for WordPress. I was just on a shared hosting plan which means my stuff will run slow along with all the others on my server. And if I am a resident with a server hog then I am in trouble. My hosting company BlueHost does have a WordPress hosting option but it is considerably more. I did hear it was worth it so I will have to decide on this one in the future.
- I installed a plugin called W3 Total Cache basically to speed up the page loading times and use the minify settings. I still do not have a total grasp on all of the settings but that will come in a later post when I am able to go into depth about this plugin. For now I used it to have some Java script and CSS load later and used it to cache my most viewed pages. It works well right out of the install with the default settings but does a lot more to speed up your site that I want to get into at a later time.
- One of the biggest killers of load times is images. When they are not optimized they take up a ton of space and load slowly. I never gave this much thought I just added whatever images I wanted and if they were 4496x3784px so much the better. That meant they were crisp and clear. Well I used a plugin called EWWWW Image Optimizer and it does a good job of on the fly optimization of all the images I upload. You can also go back and optimize all the images in your gallery as well.
- One thing that helped out my load time significantly was a complete front page overhaul. I had a lot of articles loading, all of them it seemed, and several ads. I got rid of all the ads, social icons, and unnecessary plugins (I had a twitter and Facebook plugin loading on the front page, and three ads) and had them load on a sidebar not on the front page. Once I streamlined the page it loaded a lot quicker and looked a lot cleaner.
- Optimize your database and also get rid of extra revisions. I looked at the revision list on one of my articles and it had over twenty revisions. These were being stored and I never used them once except for the occasional auto save. So get a plugin that will keep those at bay. Also if you get the plugin WP-Optimize it will clean them up for you and also optimize your databases. It does it with a click of a link very simply and very easily. This was one plugin that was recommended to me that was very easy to setup and use.
- Learn to load thing asynchronously, especially Java script and Google Adsense ads. Also learn how to defer parsing of Java script. Most of these are difficult to learn how to do. W3Total Cache can help with the Java script deferment but the other one you need to add some serious code to. To learn more about asynchronous resources read a quick information page from GTMetrix.
- A CDN or content delivery network can help spread information across a bunch of different servers. These servers then can deliver this content to your site viewers who are closer in proximity to those servers. This can help improve the page loading time for users who are all over the globe and not close to you. Normally a CDN service will cost a monthly fee so you will need to decide if you want this service. But if your traffic volume is high then probably so is your website content volume and you should consider this option.
- The last thing we will tried is to add code to our root .htaccess file that will give an expiration date to our headers and other information that doesn’t normally change. This will allow frequent users of the site to have a faster load time. Also we are trying to combine external Java scripts and CSS style sheets in order to have a faster page loading time. This is proving very difficult for us as I am not good with generating these changes within code. But I am looking for a simpler way.
In the end we got twice as fast a significant upgrade:
As you can see we still have some work to do, we went from a page that loaded in 6-8 seconds to one that loaded in 2-5 seconds and we now load better than 58% of the sites out there then being slower than 85% of the sites. So we still have a lot to learn on site speed optimization but this is a good start for us. We will expand this article further with some follow articles on the following.
- W3 Total Cache – how to setup
- A good CDN for not a lot of money
- Code to add expires headers
- How to make fewer HTTP requests
- How to get asynchronous resources
- How to defer parsing of Java script better